<template>
	<view class="homehelper-manage">
		<view class="top">
			<!-- <uni-search-bar @confirm="confirm" @input="input" /> -->
			<view class="top-left">
				<SearchBarCom placeholder="搜索标题" @confirm="confirm"></SearchBarCom>
			</view>
			<button @click="addHelper">
				<text> + </text>
				<text>创建家政员</text>
			</button>
		</view>
		<view class="tab-bar">
			<text :class="['bar',currentIndex==0?'active':'']" @click="changeTab(0)">全部</text>
			<text :class="['bar',currentIndex==1?'active':'']" @click="changeTab(1)">使用中</text>
			<text :class="['bar',currentIndex==2?'active':'']" @click="changeTab(2)">已停止</text>
			<text :class="['bar',currentIndex==3?'active':'']" @click="changeTab(3)">已关闭</text>
			<text :class="['bar',currentIndex==4?'active':'']" @click="changeTab(4)">首页推荐</text>
			<text :class="['bar',currentIndex==5?'active':'']" @click="changeTab(5)">置顶</text>
		</view>
		<view class="content">
			<view class="tips">
				共有{{ total }}条符合条件记录
			</view>
			<view class="card-item" v-if="currentIndex==0">
				<block v-for="item in homeHhelperList" :key="item.id">
					<ManageItem ctype="1" :item="item" @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
			<view class="card-item" v-if="currentIndex==1">
				<block v-for="item in usingList" :key="item.id">
					<ManageItem ctype="1" :item="item"  @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
			<view class="card-item" v-if="currentIndex==2">
				<block v-for="item in stopList" :key="item.id">
					<ManageItem ctype="1" :item="item" @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
			<view class="card-item" v-if="currentIndex==3">
				<block v-for="item in closeList" :key="item.id">
					<ManageItem ctype="1" :item="item" @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
			<view class="card-item" v-if="currentIndex==4">
				<block v-for="item in recommendList" :key="item.id">
					<ManageItem ctype="2" :item="item" @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
			<view class="card-item" v-if="currentIndex==5">
				<block v-for="item in upList" :key="item.id">
					<ManageItem ctype="3" :item="item" @updateItem="updateItem" @updateHelper="updateHelper"></ManageItem>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
	import { GetHomeHelperList, GetHelperByKeywords,FindByTelphone } from '../../api/index.js'
	export default {
		data() {
			return {
				currentIndex:0,
				homeHhelperList:[],
				usingList:[],
				stopList:[],
				closeList:[],
				recommendList:[],
				upList:[]
			};
		},
		onLoad(){
			this.getHomeHelperList()
			console.log('22')
		},
		methods:{
			updateItem(e){
				console.log(e,'e')
				this.usingList = this.filterDataList(0)
				// this.usingList.forEach(item=>item.id==e.id)
				if(e){
					this.getHomeHelperList().then(()=>{
						this.usingList = this.filterDataList(0)
						this.stopList = this.filterDataList(1)
						this.closeList = this.filterDataList(2)
						this.recommendList = this.filterDataListByRecommend()
						this.upList = this.filterDataListByUp()
					})
					
					
				}
			},
			async confirm(e){
				console.log('55confirm')
				let paramsData = {
					keywords:e.keywords
				}
				const { data:res } = await GetHelperByKeywords(paramsData)
				console.log(res)
				this.homeHhelperList = res.data
				this.currentIndex = 0
			},
			input(){},
			changeTab(index){
				// this.getHomeHelperList()
				console.log('q',index)
				this.currentIndex = index
				if(index==1){
					return this.usingList = this.filterDataList(0)
				}
				if(index==2){
					return this.stopList = this.filterDataList(1)
				}
				if(index==3){
					return this.closeList = this.filterDataList(2)
				}
				if(index==4){
					return this.recommendList = this.filterDataListByRecommend()
				}
				if(index==5){
					console.log(this.upList,this.filterDataListByUp(),'g')
					return this.upList = this.filterDataListByUp()
				}
			},			
			async getHomeHelperList(){
				const { data:res } = await GetHomeHelperList()
				console.log(res)
				// res.data.forEach(item=>{
				// 	item.disc = item.disc?.split('，')
				// })
				console.log(res.data,'rrr')
				res.data.forEach(item=>{
					item.create_time = item.create_time.slice(0,item.create_time.length-5).replace('T',' ')
					item.update_time = item.update_time.slice(0,item.update_time.length-5).replace('T',' ')
				})
				res.data.sort((a,b) => a.order_num - b.order_num)
				this.homeHhelperList = res.data
			},
			// 过滤数据
			filterDataList(num){
				return this.homeHhelperList.filter(item=>item.status==num)
			},
			filterDataListByRecommend(){
				return this.homeHhelperList.filter(item=>item.is_recommend==1)
			},
			filterDataListByUp(){
				
				let newlist = this.homeHhelperList.filter(item=>item.is_up==1)
				newlist.sort((a,b)=>a.update_time - b.update_time)
				return this.upList = newlist
			},
			// 添加家政员
			addHelper(){
				uni.navigateTo({
					url:'/subPackageAdmin/OrderSet/OrderSet'
				})
			},
			// 更新
			updateHelper(e){
				
				if(e.type=='del'){
					console.log(e,'删除更新e')
					let index = this.homeHhelperList.findIndex(item=>item.id = e.id)
					this.homeHhelperList.splice(index,1)
					let index1 = this.usingList.findIndex(item=>item.id = e.id)
					this.usingList.splice(index1,1)
					let index2 = this.stopList.findIndex(item=>item.id = e.id)
					this.stopList.splice(index2,1)
					let index3 = this.closeList.findIndex(item=>item.id = e.id)
					this.closeList.splice(index3,1)
					// let index4 = this.recommendList.findIndex(item=>item.id = e.id)
					// this.recommendList.splice(index4,1)
					// let index5 = this.upList.findIndex(item=>item.id = e.id)
					// this.upList.splice(index5,1)
				}
				if(e.type=='top'){
					console.log(e,'置顶更新e')
					
					// console.log(this.upList,'up',index6)
					// this.upList
					// this.getHomeHelperList()
					// this.upList = this.filterDataListByUp()
					let index6 = this.upList.findIndex(item=>item.id = e.id)
					this.upList.splice(index6,1)
					this.getHomeHelperList()
					console.log(this.upList,'this')
					
				}
				if(e.type=='rec'){
					console.log(e,'推荐更新e')
					let index7 = this.recommendList.findIndex(item=>item.id = e.id)
					this.recommendList.splice(index7,1)
					this.getHomeHelperList()
					// this.recommendList = this.filterDataListByRecommend()
					console.log(this.recommendList,'this')
					
				}
				
				
				
			}
		},
		computed:{
			total(){
				if(this.currentIndex==0){
					return this.homeHhelperList?.length
				}
				else if(this.currentIndex==1){
					return this.usingList?.length
				}
				else if(this.currentIndex==2){
					return this.stopList?.length
				}
				else if(this.currentIndex==3){
					return this.closeList?.length
				}
				else if(this.currentIndex==4){
					return this.recommendList?.length
				}
				else if(this.currentIndex==5){
					return this.upList?.length
				}
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	
.homehelper-manage{
	padding: 20rpx;
	.top{
		display: flex;
		align-items: center;
		justify-content: space-between;
		// margin-top: 20rpx;
		.top-left{
			flex: 1;
			// margin: 0 20rpx 20rpx 0;
			margin-right: 20rpx;
		}
		button{
			width: 220rpx;
			height: 70rpx;
			line-height: 70rpx;
			background: #1E90FF;
			color: #fff;
			font-size: 30rpx;
		}
	}
	.tab-bar{
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		margin-top: 20rpx;
		.bar{
			font-weight: bold;
			line-height: 70rpx;
			height: 70rpx;
			&.active{
				color: #1E90FF;
				border-bottom: 3px solid #1E90FF;
				// padding-bottom: 10rpx;
				box-sizing: border-box;
			}
		}
	}
	.content{
		.tips{
			text-align: center;
			color: #666;
			height: 70rpx;
			line-height: 100rpx;
			// border: 1px solid #000;
		}
		.card-item{
			margin: 20rpx;
		}
	}
}
</style>
